<!--
 * @Author: 蔡继周
 * @Date: 2021-11-16 14:20:45
 * @LastEditTime: 2021-11-21 02:31:10
 * @LastEditors: Please set LastEditors
 * @Description: I have to do something...
 * @FilePath: \tableTep\src\components\FormTep\itemView\SelectMoudel.vue
-->
<template>
  <el-form-item
    :label="column.title ? column.title + '：' : ''"
    :prop="column.name"
    :rules="rules"
  >
    <el-select
      v-model="value"
      style="width: 100%;"
      :placeholder="`请选择${column.title}`"
      @change="(value) => column.change && column.change(value)"
      v-bind="column.definProps"
    >
      <el-option
        v-for="item in column.options"
        :key="item.value"
        :label="item.label"
        :value="item.value"
        :disabled="item.disabled"
      />
    </el-select>
  </el-form-item>
</template>
<script setup>
import { computed, onMounted } from "vue";
import useComputedRule from "./../hooks/useComputedRule";
const emit = defineEmits(["update:model"]);
const props = defineProps({
  column: {
    type: Object,
    default: () => {},
  },
  model: {
    default: "",
  },
});
const { rules } = useComputedRule(props);
const value = computed({
  get: () => props.model,
  set: (val) => emit("update:model", val),
});
</script>
